<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我的理财产品信息页面</title>
    <script src="../../static/js/jquery-1.11.0.js"></script>
    <style>

        #d1 {
            width: 480px;
            height: 86vh;
            position: absolute;
            margin-top: 2vh;
            /*margin-left: 400px;*/
            right: 500px;
            background: rgba(255, 255, 255, 0.7);
            border-radius: 16px;
            text-align: center;
            /**/
            /*    内容超出时，打开滚动条*/
            overflow: auto;
        }

        .h1 {
            margin-top: 10px;
        }

        .d1 {
            /*border: 1px solid red;*/
            width: 100%;
            /*!*    内容超出时，打开滚动条*!*/
            /*    overflow: auto;*/

        }

        .prod {
            margin-top: 10px;
            width: 94%;
            margin-left: 3%;
            height: 200px;
            border: 1px solid gray;
            border-radius: 5px;
        }

        .prod > input[type=button] {
            width: 100px;
            height: 40px;
            border-radius: 5px;
            background-color: mediumseagreen;
            margin-top: 10px;
        }

        .prod > h2 {
            margin-top: 20px;
        }


        .b {
            width: 200px;
            height: 40px;
            border-radius: 5px;
            background-color: mediumseagreen;
            margin-top: 10px;
        }

        #d4 > input[type=text] {
            width: 240px;
            height: 40px;
            margin-top: 20px;
            padding-left: 20px;
        }

        #d4 > input[type=button] {
            width: 100px;
            height: 40px;
            border-radius: 5px;
            background-color: mediumseagreen;
            margin-top: 10px;
        }

        #pro {
            width: 260px;
            height: 40px;
            margin-top: 20px;
            margin-bottom: 20px;
        }
    </style>

    <script>
        $(function () {
            //查询当前登录着购买的理财产品信息
            var uid=$("#userid").text();
            //var uid = 3;
            if (uid != "") {
                //查询用户所有购买的理财产品
                showlist();

                //查询当前用户所有可以已审核储蓄银行卡
                $.ajax({
                    url: "/product",
                    type: "post",
                    data: {action: "findCardByUser", uid: uid},
                    dataType: "json",
                    success: function (d) {
                        if (d.code == 1) {
                            for (var i = 0; i < d.data.length; i++) {
                                var a = d.data[i].c_id;
                                var b = a.substring(a.length - 4);
                                $("#pro").append(" <option value='" + d.data[i].c_id + "'>" + d.data[i].c_account + "(" + b + ")</option>")
                            }
                        } else {
                            alert(d.msg);
                        }
                    }
                })
            }

        })

        function showlist(){
            var uid=$("#userid").text()
            $.ajax({
                url: "/product",
                data: {action: "findMyProByUid", uid: uid},
                type: "post",
                dataType: "json",
                success: function (d) {
                    // console.log(d);
                    if (d.code == 1) {
                        if (d.data.length == 0) {
                            $(".d1").html("<h3 style='margin-top: 200px'>您还没有购买任何理财产品，请先购买理财产品</h3>")
                        } else {
                            $(".d1").html("");
                            for (var i = 0; i < d.data.length; i++) {
                                var money = d.data[i].money;
                                var starttime = d.data[i].date;
                                var endtime = new Date();//获取当前时间
                                var rate = gettime(starttime, endtime.getTime(), money, d.data[i].p_rate);
                                // console.log(rate);
                                $(".d1").append("<div class='prod'>" +
                                    "<h2>" + d.data[i].p_name + "</h2><br>" +
                                    "<span>本金：￥</span><span class='capital'>" + d.data[i].money + "</span><br>" +
                                    "<span>收益：￥</span><span class='money'>" + rate.toFixed(2) + "</span><br>" +
                                    //"<input type='button' value='提现' onclick='f1("+d.data[i].id+")' style='margin-right: 20px'>" +
                                    "<input type='button' value='卖出'onclick='f2(" + d.data[i].id + "," + rate.toFixed(2) + ")'>" +
                                    "</div>");
                            }
                        }

                    } else {
                        alert(d.msg);
                    }

                },
                error: function () {
                    alert("服务器正在维护，请稍后再试！");
                }
            })
        }
        //提现
        function f1(id) {
            alert("1----" + id)
        }


        //卖出
        function f2(id, rate) {
            var uid = $("#userid").text();//用户id
            var cid = $("#pro").select().val();
            if (cid == "-1") {
                alert("请选择收款银行卡")
            } else {
                $.ajax({
                    url: "/product",
                    data: {
                        action: "sellMyPro",
                        uid:uid,
                        id:id,
                        cid:cid,
                        rate:rate
                    },
                    type: "post",
                    dataType: "json",
                    success: function (d) {
                        if(d.code==1){
                            alert(d.msg);
                            //刷新数据
                            showlist();
                        }else {
                            alert(d.msg);
                        }
                    }
                })
            }

            // alert("2----" + id + rate)
        }

        //获取两个时间差 并计算利息
        function gettime(starttime, endtime, money, rate) {
            var mydate = endtime - starttime;
            //求天数
            var days = Math.floor(mydate / (24 * 3600 * 1000));

            //计算利息
            var b = 0
            if (days > 0) {
                for (var i = 0; i < days; i++) {
                    var a = money / 100 * rate;
                    money += a;
                    b += a;
                }
                // console.log(b.toFixed(2))
                return b;
            } else {
                return b;
            }
        }
    </script>
</head>
<body>
<!--主体部分-->
<div id="d1">
    <h1 class="h1">我的理财</h1>

        <span>转入账户：</span><select name="interest" id="pro" class="laySelect">
        <option value="-1">----请选择----</option>

    </select><br>
    <div class="d1">
        <!--        <div class="prod"><h2>产品1</h2><br>-->
        <!--            <span>本金：￥</span><span class="capital">300.00</span><br>-->
        <!--            <span>收益：￥</span><span class="money">20.00</span><br>-->
        <!--            <input type="button" value="提现">-->
        <!--            <input type="button" value="全部提现">-->
        <!--        </div>-->
    </div>
</div>
<!--修改时，弹出层 ，弹出遮罩层，和内容-->
<div id="deviceadd"
     style=" display: none;width: 100%;height: 100vh;position: fixed;top: 0vh;left: 0vh;background: rgba(48,48,48,0.7);">
    <div id="d4"
         style="width:500px;height:600px; display: block; position: absolute;  background-color: rgba(255,255,255,1);left: 70vh;top: 10vh;text-align: center">
        <h1 style="margin-top: 50px">购买理财产品</h1>

    </div>
</div>
</body>
</html>